<!DOCTYPE HTML>
<html lang="en-US">
 
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        html,
        body {
            width: 100%;
        }
        .box {
            width: 480px;
            margin:100px auto;
        }
        img{
            width:480px;
            height:300px;
            border-radius: 100% 100% 100% 100% / 0% 0% 30% 30%;
            /* border-radius: 50% / 100% 100% 0 0; */
            /* border-radius: 100% 0 0 100% / 50%; */
            /* border-radius: 100% 0 0 0; */
                         
        }
        /* border-radius的常规用法我就不说了，这里就讲解一下上面那几个参数指的是什么；前面的是水平半径；后面的是垂直半径*/
    </style>
</head>
 
<body>
    <div class="box">
        <img src="upload/slider.jpg.dpg" alt="">
    </div>
</body>
 
</html>